
var tabs = {};


var inoutPanel = Ext.create("Ext.tree.Panel", {
	id:"inoutPanel",
	title : "按输入输出",
	autoScroll:true,
	collapsible: true,
	split:true,
	width: 220,
	rootVisible:false,	
	hideHeaders: true,
	store:createInoutTreeStore(),
	columns: [
	  		{ xtype: 'treecolumn',dataIndex: 'name', flex: 1 }
	],
	listeners: {
		
		itemclick:function(tree, node, div, d, f, g, h, i ){
			onTreeNodeClicked(tree,node,div);
		}
	}
});
function createInoutTreeStore(){

	Ext.define('Inout', {
		extend: 'Ext.data.Model',
		fields: [
			{ name: 'id', type: 'int' },
			{ name: 'name', type: 'string' }
		],
		proxy: {
			type: 'ajax',
			url : 'inouts.json'
			/*,api: {
				create: 'createPersons',
				read: 'test.jsons',
				update: 'updatePersons',
				destroy: 'destroyPersons'
			}*/
		}

	});
	var treeStore = Ext.create('Ext.data.TreeStore', {
		model: 'Inout',
		root: {
			name: 'tree'
			,expanded: true
		}
	});

	//treeStore.load();
	return treeStore;
	
}

var areaPanel = Ext.create("Ext.tree.Panel", {
	id:"areaPanel",
	title : "按领域",
	split:true,
	width: 220,
	autoScroll:true,
	store:createAreaTreeStore(),
	border:false, 
	collapsible: true,
	rootVisible:false,
	hideHeaders: true,//隐藏表头
	useArrows: true,
	layout:"fit",
	singleClickExpand:true,
	columns: [
		{ xtype: 'treecolumn',dataIndex: 'name', flex: 1 }
	],
	listeners: {
		
		itemclick:function(tree, node, div, d, f, g, h, i ){
			onTreeNodeClicked(tree,node,div);
		}
	}
});

function createAreaTreeStore(){

	Ext.define('Person', {
		extend: 'Ext.data.Model',
		fields: [
			{ name: 'id', type: 'int' },
			{ name: 'name', type: 'string' }
		],
		proxy: {
			type: 'ajax',
			url : 'areas.json'
			/*,api: {
				create: 'createPersons',
				read: 'test.jsons',
				update: 'updatePersons',
				destroy: 'destroyPersons'
			}*/
		}

	});
	var treeStore = Ext.create('Ext.data.TreeStore', {
		model: 'Person',
		root: {
			name: 'tree'
			,expanded: true
		}
	});

	//treeStore.load();
	return treeStore;
	
}
var groupPanel = Ext.create("Ext.panel.Panel", {
	id:"groupPanel",
	title : "按过程组",
	autoScroll:true,
	collapsible: true,
	split:true,
	width: 220,
	items:[]
});

var navigationPanel = Ext.create("Ext.panel.Panel", {
	id:"navigationPanel",
	title : "导航栏",
	region : "west",
	layout:"accordion",
	autoScroll:true,
	collapsible: true,
	split:true,
	width: 220,
	items:[inoutPanel,areaPanel,groupPanel]
});

Ext.define("tt.lab.pmbok.Navigation",{
	panel:navigationPanel,
	constructor: function (args) {
    },
    
    init: function(){
    }
});



function onTreeNodeClicked(tree,node,div){
	//ExtJS5: node.data.type
	var type = node.raw.type;
	var id = node.raw.id;
	var title = node.raw.name;
	if(type=="P") {
		Ext.create("TT.process",{id:id, title:title, parent:centerTabPanel});
	} else if(type=="I"||type=="O") {
		Ext.create("TT.inout",{id:id, title:title, parent:centerTabPanel});
	} else if(type=="T") {
		Ext.create("TT.tool",{id:id, title:title, parent:centerTabPanel});
	}
	
}
/**
function createProcessesPanel(title){
	var panel = Ext.create('Ext.panel.Panel', {
	    title:title,
	    layout:"border",
	    closable:true,
	    items:[
	    	{title:"", region:"center", html:"<h1 class=\"x-panel-header\"><img src=\"images/4.png\"/></h1>"}
	    	
	    ]
	});
	return panel;
}
*/

